<template>
    <el-card shadow="never" class="!border-none">
        <router-link
            :to="{
                path: getRoutePath('marketing.printer/add')
            }"
            ><el-button type="primary">新增打印机</el-button>
        </router-link>
        <el-table size="large" :data="pager.lists" class="mt-[14px]">
            <el-table-column prop="name" label="打印机名称" />
            <el-table-column prop="type_desc" label="打印机类型" />
            <el-table-column prop="print_number_desc" label="打印联数" />
            <el-table-column prop="auto_print_desc" label="自动打印" />
            <el-table-column prop="status" label="打印机状态">
                <template #default="{ row }">
                    <el-switch
                        v-model="row.status"
                        :active-value="1"
                        :inactive-value="0"
                        @click="handleChange(row)"
                    />
                </template>
            </el-table-column>
            <el-table-column prop="create_time" label="创建时间" />
            <el-table-column label="操作" fixed="right">
                <template #default="{ row }">
                    <router-link
                        :to="{
                            path: getRoutePath('marketing.printer/add'),
                            query: {
                                id: row.id
                            }
                        }"
                    >
                        <el-button type="primary" link> 编辑 </el-button>
                    </router-link>
                    <el-button
                        v-if="row.root != 1"
                        type="danger"
                        link
                        @click="handleDelete(row.id)"
                    >
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="flex justify-end mt-4">
            <pagination v-model="pager" @change="getLists" />
        </div>
    </el-card>
</template>

<script setup lang="ts">
import { reactive, toRefs } from 'vue'
import { usePaging } from '@/hooks/usePaging'
import { getprinterlists, printerStatus, delprinter } from '@/api/application'
import feedback from '@/utils/feedback'
import EditPopup from './edit.vue'
import { getRoutePath } from '@/router'

const { pager, getLists, resetPage, resetParams } = usePaging({
    fetchFun: getprinterlists
})
getLists()
const handleChange = async (params: any) => {
    await printerStatus(params)
}
const handleDelete = async (id: number) => {
    await feedback.confirm('确定要删除？')
    await delprinter({ id })
    getLists()
}
</script>

<style lang="scss" scoped></style>
